<template>
  <div class="homeHot" v-if="hot">
    <RecommendBanner :banners="banners" />
    <HotFunction :functions="hotFunctions" />
    <UserLikeItem
      v-for="(bigCard, index) in bigCards"
      :key="index"
      :like="bigCard.children[0].model"
    />
  </div>
</template>

<script>
import RecommendBanner from "@/components/RecommendBanner.vue";
import HotFunction from "@/components/HotFunction.vue";
import UserLikeItem from "@/components/UserLikeItem.vue";

export default {
  components: {
    RecommendBanner,
    HotFunction,
    UserLikeItem,
  },
  data() {
    return {
      hot: null,
      banners: null,
      hotFunctions: null,
      bigCards: null,
    };
  },
  created() {
    this.$toast.loading({
      message: "加载中...",
      forbidClick: true,
      duration: 0,
    });
    this.$axios.get("/homeHot.json").then((res) => {
      // this.$axios.get("https://apis.netstart.cn/xpc/home/hot").then((res) => {
      // console.log(res.data.data);
      this.hot = res.data.data;
      // 轮播图
      this.banners = this.hot.children.filter(
        (o) => o.type == "uiBanner"
      )[0].children;
      // 功能
      this.hotFunctions = this.hot.children.filter(
        (o) => o.type == "uiFunction"
      )[0].children;
      // 大卡片，广告
      this.bigCards = this.hot.children.filter((o) => o.type == "uiBigCard");
      this.$toast.clear();
    });
  },
};
</script>

<style lang="scss" scoped>
.homeHot {
  padding: 7.5px;
  background-color: #f7f7f7;
}
</style>
